<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon"/>
    <link href="/style.css-v=2.0.css" tppabs="/css/style.css?v=2.0" rel="stylesheet" type="text/css"/>
    <link href="/flexslider.css" tppabs="/css/flexslider.css" rel="stylesheet" type="text/css"/>
    <link href="/BreakingNews.css" tppabs="/css/BreakingNews.css" rel="stylesheet" type="text/css"/>
    <link href="/index.css-v=2.2.css" tppabs="/css/index.css?v=2.2" rel="stylesheet" type="text/css"/>
    <link href="/css/style.css" rel="stylesheet" type="text/css">
    <link href="/css/content.css" rel="stylesheet" type="text/css">
    <link href="/css/order.css" rel="stylesheet" type="text/css">
    <script src="/js/jquery.min.js"></script>
    <script src="/js/jquery.form.js"></script>
    <script src="/layer/layer.min.js"></script>
    <title>农业生态认养</title>
</head>
<body>

<div class="header">
    <div class="wrap">
        <ul class="fl logo"><a href="/index">
            <img height="50" src="${pageContext.request.contextPath}/72c7b7595ea7c2270f47da67815ac4f1.png"/></a>
        </ul>
        <ul class="mobile-nav"><span class="mob-nav-btn">Menu</span></ul>
        <ul class="nav fl">
            <li class="on" style="border:0;"><a href="/index">首页</a></li>
            <li><a href="#">关于我们</a></li>
            <li><a href="13.html">入驻条例</a></li>
            <li><a href="/news">行业新闻</a></li>
            <li><a href="/announcement">平台公告</a></li>
        </ul>
        <ul class="fr member">
            <c:if test="${empty user}">
                <a href="zhuce">注册</a> <span></span>
                <a href="login">登录</a>
            </c:if>
            <c:if test="${not empty user}">
                <a href="/isUserAdmin?type=1">个人中心</a> <span></span>
                <a href="javascript:void(0)" onclick="exit()">退出</a>
                <script>
                    function exit() {
                        //询问框
                        layer.confirm('是否真的退出', {
                            btn: ['退出','取消'] //按钮
                        }, function(){
                            $.ajax({
                                url:"exit",//请求的地址
                                type:"post",//请求方式
                                dataType:"json",//请求的内容格式
                                success:function(data){
                                    if (data.result==true){
                                        layer.msg(data.msg, {
                                            time : 2000
                                        }, function() {
                                            window.location.href = window.location.href;
                                        });
                                    }
                                }
                            });
                        }, function(){
                            layer.msg("取消成功", {
                                time : 2000
                            }, function() {
                                window.location.href = window.location.href;
                            });
                        });
                    }
                </script>
            </c:if>

        </ul>
        <form action="#" method="get">
            <ul class="fr search-box">
                <input type="hidden" name="pid" value="">
                <input name="sh_keywords" class="kw fl" type="text" value="输入关键词搜索…"
                       onfocus="if(this.value=='输入关键词搜索…')this.value='';"/><input type="submit" class="sbmt fr"
                                                                                  value=""/></ul>
        </form>
    </div>
</div>

<div class="wrap mg60">
    <div class="step">



        <dl <c:if test="${type==1}"> class="on" </c:if>>
            <dt>1</dt>
            <dd>提交订单</dd>
        </dl>
        <dl <c:if test="${type==2}"> class="on" </c:if>>
            <dt>2</dt>
            <dd>支付订单</dd>
        </dl>
        <dl <c:if test="${type==3}"> class="on" </c:if>>
            <dt>3</dt>
            <dd>订单完成</dd>
        </dl>
        <div class="step-line"></div>
    </div>
    <c:if test="${type==1}">
    <form action="/order/inster" method="post">
        <div class="order-step1" style=" position:relative">
            <h1><span>认养购买</span></h1>
            <dl>
                <dt>认养名称：</dt>
                <dd>${goods.gname}</dd>
                <input type="hidden" name="gid"  value="${goods.id}">
            </dl>
            <dl>
                <dt>认养周期：</dt>
                <dd>${goods.gtime}天</dd>
            </dl>
            <dl>
                <dt>认养单价：</dt>
                <dd><span id="price">${goods.price}</span> 元</dd>
            </dl>
            <dl>
                <dt>认养库存：</dt>
                <dd><span >${goods.inven}</span> 份</dd>
            </dl>
            <dl>
                <dt>认养数量：</dt>
                <dd class="buy-num"><input name="num" id="num" type="text" value="1" class="input_box" readonly=""><p><span class="btn_add" onclick="jia()">+</span><span class="btn_minus" onclick="jian()">-</span></p> 份</dd>
            </dl>
            <dl>
                <dt>应付费用：</dt>
                <dd><span class="red" id="total">${goods.price}</span> 元</dd>
                <input type="hidden" name="rnumber" id="rnumber" value="${goods.price}">
            </dl>
            <dl>
                <dt>收货人：</dt>
                <dd><input name="name"  type="text" size="30" maxlength="50" class="input_box" value="" placeholder="请输入收货人" data-rq="1"></dd>
            </dl>
            <dl>
                <dt>联系电话：</dt>
                <dd><input name="tel"  type="text" size="30" maxlength="50" class="input_box" value="${user.tel}" placeholder="请输入联系电话" data-rq="1"></dd>
            </dl>
            <dl>
                <dt>收货地址：</dt>
                <dd><input name="orderadd"  type="text" size="58" maxlength="100" class="input_box" value="" placeholder="请输入收货地址" data-rq="1"></dd>
            </dl>
            <dl>
                <dt>订单备注：</dt>
                <dd>
                    <textarea name="text" cols="60" rows="5" class="input_box"  style=" height:auto; overflow:auto; margin-top:5px; padding-top:5px;" placeholder="请输入订单备注"></textarea>
                </dd>
            </dl>
            <dl class="mg40">
                <dt></dt>
                <dd>
                    <input name="nProId" type="hidden" value="24">
                    <input type="submit" class="m-btn" value="提交订单">
                </dd>
            </dl>
            <ul style=" position:absolute; right:40px;top:120px;"><img src="/${goods.img}" class="imgBorder"></ul>
        </div>
    </form>
        <script>
            function jia(){
                var num=$("#num").val();
                if(num>=${goods.inven}){
                    $("#num").val(${goods.inven});
                }else{
                    $("#num").val(num*1+1);
                }
                jisuan();

            }
            function jian(){
                var num=$("#num").val();
                if(num<=0){
                    $("#num").val(0);
                }else{
                    $("#num").val(num*1-1);
                }
                jisuan();
            }


            function jisuan(){
                var num=$("#num").val();
                $("#total").text(num*1*${goods.price});
                $("#rnumber").text(num*1*${goods.price});
            }
        </script>
    </c:if>

    <c:if test="${type==2}">
        <form action="/order/zf" method="post">
            <div class="order-step1" style=" position:relative">
                <h1><span>支付订单</span></h1>
                <dl>
                    <dt>认养名称：</dt>
                    <dd>${goods.gname}</dd>
                    <input type="hidden" name="oid" id="oid" value="${orderForm.id}">
                </dl>
                <dl>
                    <dt>认养周期：</dt>
                    <dd>${goods.gtime}天</dd>
                    <input type="hidden" name="gtime" id=gtime value="${goods.gtime}">
                </dl>
                </dl>
                <dl>
                    <dt>应付费用：</dt>
                    <dd><span class="red">${orderForm.rnumber}</span> 元</dd>
                </dl>
                <dl>
                    <dt>收货人：</dt>
                    <dd>${orderForm.name}</dd>
                </dl>
                <dl>
                    <dt>联系电话：</dt>
                    <dd>${orderForm.tel}</dd>
                </dl>
                <dl>
                    <dt>收获地址：</dt>
                    <dd>${orderForm.orderadd}</dd>
                </dl>
                <dl>
                    <dt>支付密码：</dt>
                    <dd><input name="zfpassword" type="password" size="58" maxlength="100" class="input_box" value="" placeholder="请输入支付密码" data-rq="1"></dd>
                    <span style="color: red;">${iszf}</span>
                </dl>

                <dl class="mg40">
                    <dt></dt>
                    <dd>
                        <input name="nProId" type="hidden" value="24">
                        <input type="submit" class="m-btn" value="确认支付">
                    </dd>
                </dl>
                <ul style=" position:absolute; right:40px;top:120px;"><img src="/${goods.img}" class="imgBorder"></ul>
            </div>
        </form>

    </c:if>


    <c:if test="${type==3}">
            <div class="order-step1" style="height: 100%; position:relative">
                <h1><span>支付成功！订单完成</span></h1>
            </div>
    </c:if>
</div>


<style>
    .footer .footer-l{
        width: 605px !important;
        float: left;
        text-align: left;
    }
    .footer .footer-r{
        width: 495px;
        height: 82px;
        float: right;

    }
    .fter-r {
        width: 165px;
        float: right;
        text-align: left;
    }
    .fter-l {
        width: 136px;
        float: right;
        text-align: left;
    }

    .fter-l span{
        font-size:20px;

    }

    .footer-r span{
        display: block;
        text-align: left;
        line-height: 28px;
    }
    .ft-links {
        padding-left: 20px;
        color: #fff;
    }.ft-nav a {
         display: inline-block;
         padding: 0 20px;
         color: #fff;
     }
    .foot_copy {
        background: #373d41;
        line-height: 2;
        padding: 30px 0;
        text-align: center;
        font-family: Arial, Helvetica, sans-serif;
        color: #fff;
    }
    .ft-links a {
        padding: 0 5px;
        display: inline-block;
        color: #fff;
    }
    .copyright {
        padding-left: 20px;
    }
    .xinren{
        height: 70px;
        margin-top: 20px;
    }
    .xinren img {
        height: 70px;
        padding: 0px 5px;
    }

    .appimg {
        width: 186px;
        float: right;
        height: 80px;
    }
    .appimg img {
        width: 80px;
        height: 80px;
        margin-left: 10px;
        overflow: hidden;
    }
</style>




<div class="footer">
    <div class="foot_copy wow bounceInUp">
        <div class="wrap">
            <div class="footer-l">
                <div class="copyright">湘南学院毕业设计作品->农业生态认养
                    作者：****
                </div>
            </div>
        </div>

    </div>
</div>

</body>
</html>